<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta name="viewport" content="width=device-width,initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="../bootstrap-5.1.3-dist/css/bootstrap.css">
    <script src="../bootstrap-5.1.3-dist/js/bootstrap.bundle.js"></script>
    <!--css文件-->
    <link rel="stylesheet" href="style.css">
    <!--字体图标文件-->
    <link rel="stylesheet" href="font-awesome/css/font-awesome.css">
</head>

<body class="container-fluid">
    <div class="row">
        <!--header-->
        <div class="col-sm-12 col-md-3 left">
            <div class="row justify-content-between">
                <div class="col-6 col-sm-5 col-md-12 p-4">
                    <img src="images/c.jpg" alt="userPhoto" class="img-fluid p-2 border">
                    <h3 class="text-white text-center">白璐</h3>
                    <h5>求职意向：网站开发</h5>
                </div>
                <div class="col-6 col-sm-5 col-md-12 p-5 p-md-4">
                    <h4>出生年月</h4>
                    <p>1995年10月10日</p>
                    <h4>联系电话</h4>
                    <p>130XXXXXXXX</p>
                    <h4>电子邮箱</h4>
                    <p>abcd1234XXXX@qq.com</p>
                    <h4>联系地址</h4>
                    <p>北京市朝阳区</p>
                </div>
            </div>
        </div>
        <!--content-->
        <div class="col-sm-12 col-md-9 right p-0">
            <div class="my-4">
                <ul class="clearfix">
                    <li class="float-sm-start">
                        <i class="fa fa-user-circle-o fa-2x"></i>
                        <a href="index.html" class="ml-2">个人履历</a>
                    </li>
                    <li class="float-sm-start mx-sm-5">
                        <i class="fa fa-envelope-o fa-2x"></i>
                        <a href="contact.html" class="ml-2">请给我发送邮件</a>
                    </li>
                    <li class="float-sm-start">
                        <i class="fa fa-home fa-2x"></i>
                        <a href="photo.html" class="ml-2">照片</a>
                    </li>
                </ul>
            </div>
            <!--工作经历-->
            <h5 class="color1">工作经历</h5>
            <div class="px-5 py-2">
                <table class="table">
                    <thead class="table-success">
                        <tr>
                            <th scope="col">#</th>
                            <th scope="col">时间</th>
                            <th scope="col">单位</th>
                            <th scope="col">职位</th>
                        </tr>
                    </thead>
                    <tbody class="table-info">
                        <tr>
                            <th>1</th>
                            <td>2018/8-2019/10</td>
                            <td>八面恒通网络公司</td>
                            <td>软件测试工程师</td>
                        </tr>
                        <tr>
                            <th>2</th>
                            <td>2019/11-2020/10</td>
                            <td>千谷网络科技公司</td>
                            <td>软件工程师</td>
                        </tr>
                        <tr>
                            <th>3</th>
                            <td>2020/12-至今</td>
                            <td>冰园网络科技公司</td>
                            <td>前端工程师</td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <!--专业技能-->
            <h5 class="color2">专业技能</h5>
            <div class="px-5 py-2">
                <!--嵌套栅格-->
                <div class="row">
                    <div class="col-6">
                        <!--使用卡片组件-->
                        <div class="card border-primary text-primary">
                            <div class="card-header border-primary">擅长的技能</div>
                            <div class="card-body">
                                <p class="card-text">
                                    HTML、CSS、Javascript、jquery、bootstrap、Vue.js、Angular.js、node.js、PHP、MySql</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-6">
                        <div class="card border-success text-success">
                            <div class="card-header border-success">熟悉的技能</div>
                            <div class="card-body">
                                <p class="card-text">C语言、C++、C#、Java、Oracle、Python</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <h5 class="color3">教育经历</h5>
            <div class="px-5 py-2">
                <ul class="list-group">
                    <li class="list-group-item list-group-item-warning">
                        <div class="row">
                            <div class="col-4">时间</div>
                            <div class="col-4">学校</div>
                            <div class="col-4">专业</div>
                        </div>
                    </li>
                    <li class="list-group-item list-group-item-info">
                        <div class="row">
                            <div class="col-4">2013/6-2017/6</div>
                            <div class="col-4">北京大学</div>
                            <div class="col-4">计算机科学与技术</div>
                        </div>
                    </li>
                    <li class="list-group-item list-group-item-info">
                        <div class="row">
                            <div class="col-4">2017/8-2018/6</div>
                            <div class="col-4">软件开发公司</div>
                            <div class="col-4">Web前端工程师</div>
                        </div>
                    </li>
                </ul>
            </div>
            <h5 class="color4">综合概述</h5>
            <div class="px-5 py-2">
                <div id="accordion">
                    <div class="card">
                        <div class="card-header">
                            <a class="card-link" data-bs-toggle="collapse" href="#collapseOne">
                                获得证书
                            </a>
                        </div>
                        <div id="collapseOne" class="collapse show" data-bs-parent="#accordion">
                            <div class="card-body">
                                <ul class="list-group">
                                    <li class="list-group-item list-group-item-info">
                                        1、英语等级证书：大学英语四、六级证书(CET-4，CET-6)。
                                    </li>
                                    <li class="list-group-item list-group-item-info">
                                        2、计算机证书：全国计算机二级证书及三级和四级。
                                    </li>
                                    <li class="list-group-item list-group-item-info">
                                        3、学校证书包括：奖学金证书、三好学生、优秀毕业生、优秀学生干部。
                                    </li>
                                    <li class="list-group-item list-group-item-info">
                                        4、财务类证书 ：注册会计师(CPA)。
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="card">
                        <div class="card-header">
                            <a class="collapsed card-link" data-bs-toggle="collapse" href="#collapseTwo">
                                自我评价
                            </a>
                        </div>
                        <div id="collapseTwo" class="collapse" data-bs-parent="#accordion">
                            <div class="card-body">
                                本人热爱学习，工作态度严谨认真，责任心强,有很好的团队合作能力。有良好的分析、解决问题的思维。
                                诚实、稳重、勤奋、积极上进，拥有丰富的大中型企业管理经验，有较强的团队管理能力，良好的沟通协调组织能力，敏锐的洞察力，自信是我的魅力。
                            </div>
                        </div>
                    </div>
                    <div class="card">
                        <div class="card-header">
                            <a class="collapsed card-link" data-bs-toggle="collapse" href="#collapseThree">
                                兴趣爱好
                            </a>
                        </div>
                        <div id="collapseThree" class="collapse" data-bs-parent="#accordion">
                            <div class="card-body">
                                <ul class="list-group">
                                    <li class="list-group-item list-group-item-info">
                                        阅读类：读报、看杂志。
                                    </li>
                                    <li class="list-group-item list-group-item-info">
                                        运动类：篮球、足球、乒乓球。
                                    </li>
                                    <li class="list-group-item list-group-item-info">
                                        饮食类：西餐、川菜。
                                    </li>
                                    <li class="list-group-item list-group-item-info">
                                        音乐类：古典、轻音乐。
                                    </li>
                                    <li class="list-group-item list-group-item-info">
                                        服饰类：正式、休闲。
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>

</html>